<template>
    <div class="store-header">
        <wx-hide-menu v-if="wxHideMenu"></wx-hide-menu>
        <wx-no-data-share-body></wx-no-data-share-body>
        <wx-share-body v-if="(menuType == 3 || menuType == '3') && wxHideMenu"></wx-share-body>
        <div class="store-header-wrap" v-if="Object.keys(storeMsg).length > 0">
            <div class="width-full store-header-wbanner">
                <v-header class="store-header-banner" ref="refHeader"
                    v-if="storeMsg && Object.keys(storeMsg).length > 0" :headerProp="getHeaderItem()"
                    @doAttention="doAttention" @showShare="shareShow"></v-header>
            </div>
            <div class="positionR displayFlex">
                <div class="hidden-scroll">
                    <div class="displayFlex flex1 store-header-wlist user-touch" ref="headerBanner">
                        <ul class="store-header-list positionR">
                            <li v-for="(value,key) in menus" ref="menuItem" class="store-item positionR"
                                :class="{active:value.menuType == menuType && menuId == value.menuId}"
                                @click="tapmenu(value,true)">
                                <span class="positionR">
                                    {{value.name}}
                                </span>
                                <transition name="line">
                                    <span class="risk-active-line"
                                        v-show="value.menuType == menuType && menuId == value.menuId"></span>
                                </transition>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!--所有的子页面-->
        <!-- <transition :name="transitionName">
                <router-view class="child-view" ref="storeItem" v-if="showChild"/>
		    </transition> -->
        <transition name="fade">
            <router-view ref="storeItem" v-if="showChild" />
        </transition>
        <transition name="comment">
            <div class="customer-bigbox" v-show="show">
                <div class="close" @click="$store.commit('setShowCustomerList',false)">
                    <img :src="staticImageUrl('/images/store/close_button.png')" alt="">
                </div>
                <div class="customer-box">
                    <div class="customer-list">
                        <div class="customer" v-for="(item,index) in customerList" :key="index"
                            @click="handleToIM(item)">
                            <img :src="item.coverImg" alt="">
                            <div class="text">{{item.greeting}}</div>
                        </div>
                        <div class="customer" v-for="item1 in (3-customerLength)">
                            <img :src="staticImageUrl('/images/assets/images/store/customer.png')" alt="">
                            <div class="text">客服正忙...</div>
                        </div>
                    </div>
                </div>
            </div>
        </transition>
        <new-red-alert ref="newRedAlert"
            v-if="$store.state.redAlert && $route.query && !($route.query.previewController == 'true')"
            :headerProp="getHeaderItem()">
        </new-red-alert>
        <transition name="mask" leave-active-class="animated fadeOut">
            <v-share v-if="shareBordShow" @clickFn="shareShow(false)"></v-share>
        </transition>
        <!--TODO 暂时没有开发完，先注释-->
        <store-fission @enterGetMoney="enterGetMoney" v-if="!!(fission && fission.actFissionId)">
        </store-fission>
        <get-money ref="getMoney" v-if="showGetMoney"></get-money>
        <div class="first-enter">
            <static-img-alert v-if="getMoney.firstOpenAlert.show" :rqCodeContentProp="getMoney.firstOpenAlert"
                @clickBtn="enterGetMoney" @closeCode="getMoney.firstOpenAlert.show = false">
            </static-img-alert>
        </div>
    </div>
</template>

<script>
import XLocation from "../../x/XLocation";
import { mapMutations, mapState, mapGetters } from 'vuex';
import XThirdLogin from "../../x/XThirdLogin";
import xurl from "../../x/xurl";

export default {
    name: "StoreHome",
    data () {
        return {
            customerList: null,
            customerLength: null,
            menuType: '',
            wxHideMenu:false,
            selected: '1',
            tMenuType: 0,
            tMenuId: 0,
            storeMsg: {},
            isXLocationed: false,
            // storeId:591,
            storeId: '', //店铺ID
            commentListProps: { userHendleType: 'module5' },//侧边栏评论分享等
            commentKey: 0,
            commentType: 1,
            commentPageNum: 1,
            commentPageSize: 10,
            praiseRate: 0,
            giveChannel: 1,//好玩页面0，商家页面1
            isInit: true,//是否为首次加载，不是首次加载删除shareId
            share: false,
            shareBody: {},
            couponsList: [],
            discountList: [],//距离
            menus: [],//页面导航栏
            needWxLocation: false,//是否需要微信定位
            swiperIndex: 0,
            bottomSuspensionShow: false,//大师是否显示
            showChild: false,//处理vue子路由无法跳转的bug
            showGetMoney: false,
            panorama: {
                rtCommont: {
                    isNeedServer: true
                },
                panoramaMsg: {
                    mediaContents: [],
                    mediaType: '',
                },
            },
            activity: {
                rtCommont: [],
                activityMsg: {
                    list: []
                },
            },
            getMoney: {
                firstOpenAlert: {
                    show: false,
                    // hasFission:false,
                    image: this.staticImageUrl('images/circle/first_open_img.png'),
                    btnImg: this.staticImageUrl('images/circle/first_get_btn.png'),
                }
            },//底部领取现金页面
            commontType: 2,/*0:主评论  1：子评论 2: 店铺实景 3：店铺商品 4：店铺活动 5： 店铺品牌 10:多媒体信息*/
            goods: {
                rtCommont: {},
                goodsMsg: {
                    pageSize: 10,
                    pageNum: 1,
                },
                browserTimer: null,
            },
            comment: {
                rtCommont: {},
                commontMsg: {
                    pageSize: 10,
                    curPage: 1,
                },
            },
            master: {
                rtCommont: [],
                masterMsg: {
                    list: []
                },
                show: false,
            },
            browserTimer: null,
        }
    },
    created () {
        // if(!( (this.currentUser && this.currentUser.userId) && (this.currentThird && this.currentThird.thirdId) )){
        //     if(this.v_is_weixin){
        //         XThirdLogin.toLoginByWechat();
        //     }
        // }
        /*TODO 临时处理，只能在微信里面做这次活动*/
        if (!this.v_is_weixin && !(window.location.href.includes('192.168.1') || window.location.href.includes('test.haokanhaowan.cn'))) {
            XThirdLogin.toWxOpen();
        }
        /*TODO fission的暂时注释掉*/
        // this.initFission();
        this.storeMsgInit();
        // this.$store.commit('createNeplayerRoom')
    },
    computed: {
        ...mapState({
            masterState: state => state.logic.masterBoxsObj,
            playChannel: state => state.api.playChannelMsg,
            // nim:state=> state.logic.groupChat.nim,
            groupChat: state => state.logic.groupChat,
            shareBordShow: state => state.logic.shareBordShow,
            ttn: state => state.ttn,
            show: state => state.api.showCustomerList,
            fission: state => state.api.fission,
            concerned: state => state.logic.concerned,
            wxData: state => state.api.wxData,
        }),
        ...mapGetters({
            currentStore: 'currentStoreFn',
            currentUser: 'currentUserFn',
            currentThird: 'currentThirdFn',
            storeMenu: 'getterStoreMenu',
            currentUserStoreDiscount: 'currentUserStoreDiscountFn',
        })
    },
    mounted () {
        setTimeout(()=>{
            this.wxHideMenu=true;
        },300)
        // if (!userId && !thirdId) {
        //     /*这里不用用户登录就不能聊天*/
        //     if(this.v_is_weixin){
        //         XThirdLogin.toLogin();
        //     }else{
        //         this.$router.push('/to/login');
        //     }
        //     return
        // }
        setTimeout(() => {
            document.title = this.currentStore && this.currentStore.name ? this.currentStore.name : '';
        }, 1000)
        if (!this.isXLocationed) {
            this.isXLocationed = true;
            XLocation.userGetHeSelfLocation();
        }
    },
    methods: {
        ...mapMutations(['merStoreGetStoreInfo', 'updateStoreMenu', 'shareShow', 'storeFissionApi', 'getCashApi',]),
        async getCustomerList (storeId) {
            let url = `${this.NW_API_API_LOCALE_VERSION}/customer/recept/list?storeId=${storeId}`;
            await this.xurl.get(url).then((data) => {
                if (data.success) {
                    this.customerList = data.list
                    this.$store.commit('setCustomerList', this.customerList)
                }
            })
        },
        // 点击专属客服跳转到聊天室
        handleToIM (item) {
            let thirdId = this.currentThird && this.currentThird.thirdId ? this.currentThird.thirdId : 0;
            let userId = this.currentUser && this.currentUser.userId ? this.currentUser.userId : 0;
            if (!userId && !thirdId) {
                /*这里不用用户登录就不能聊天*/
                if (this.v_is_weixin) {
                    XThirdLogin.toLogin();
                } else {
                    this.$router.push('/to/login');
                }
                return
            }
            let params = {
                storeId: this.storeId,
                userId,
                thirdId,
                enterType: '2',
                enterTypeKey: item.receptId
            }
            this.$store.dispatch('getChatGroupIdApi', params).then((data) => {
                if (data.success) {
                    this.$router.push(
                        {
                            path: '/im/chat',
                            query: {
                                scene: 'team',
                                chatGroupId: data.result,
                                customerType: item.customerType,
                                customerKey: item.customerKey,
                                storeId: this.storeId
                            }
                        }
                    )
                }
            })
        },
        /*获取金币*/
        enterGetMoney (obj) {
            let tempObj = {
                "actFissionId": obj && obj.actFissionId ? obj.actFissionId : 0,
                "cashAmount": obj && obj.cashAmount ? obj.cashAmount : 0,
            }
            let that = this;
            that.showGetMoney = true;
            that.$refs.getMoney.showData();
            // that.getCashApi(tempObj);
            // function enterGetSuccessFn() {
            //     that.showGetMoney = true;
            // }
        },
        /*查询裂变信息活动*/
        getFission (data) {
            let that = this;
            /*助力成功*/
            // data.result.fissionCycle = 30
            if (data && data.floatIco) {
                // this.getMoney.firstOpenAlert.hasFission = true;
                this.firstOpenAlertShow();
            }
            /*如果要定位，就调用定位地理位置*/
            if (data && data.needGps) {
                let tempI = 0;
                that.browserTimer = setInterval(() => {
                    let xlocation = XLocation.getUserLocation() || {};
                    if (xlocation && (xlocation.longitude || xlocation.latitude)) {
                        that.helpFriend();
                        if (that.browserTimer) {
                            clearInterval(that.browserTimer);
                        }
                    }
                }, 300)
            } else {
                that.helpFriend();
            }
            // /*助力的逻辑，只有在所有都完成之后再去助力，页面刷新可能会很慢，但是可以有满足所有需求*/
            // this.getUserMoneyInfo();
        },
        initFission () {
            let that = this;
            // this.actCircleType = this.$route.query.actType;
            this.isHKHW = this.$route.query && this.$route.query.ttn == 5 ? true : false;
            // this.actCircleId = this.$route.query.actCircleId;
            // if(this.isHKHW){
            //     window.sessionStorage.setItem('circleUserInfo', JSON.stringify(userInfo));
            // }
            let userId4Link = this.$route.query && this.$route.query.userId ? this.$route.query.userId : 0;
            let loginThirdId4Link = this.$route.query && this.$route.query.loginThirdId ? this.$route.query.loginThirdId : 0;
            let userInfo = {
                userId4Link,
                loginThirdId4Link
            };
            console.log(userInfo, 'userInfo');
            let existCircleUserInfo = window.sessionStorage.getItem('circleUserInfo') ? JSON.parse(window.sessionStorage.getItem('circleUserInfo')) : {};
            ;
            if (!((existCircleUserInfo.userId4Link && existCircleUserInfo.userId4Link != '0') || (existCircleUserInfo.loginThirdId4Link && existCircleUserInfo.loginThirdId4Link != '0'))) {
                window.sessionStorage.setItem('circleUserInfo', JSON.stringify(userInfo));
            }
            let userId4Current = this.currentUser && this.currentUser.userId ? this.currentUser.userId : 0;
            let loginThirdId4Current = this.currentThird && this.currentThird.id ? this.currentThird.id : 0;
            if (userId4Link && userId4Link != '0') {
                if (userId4Current) {
                    if (userId4Link == userId4Current) {
                        console.log('userId4Link是本人do nothing')
                        //两个登录用户相同，什么也不做
                    } else {
                        //1.不相同，调用接口，帮 userId4Link 助力
                        redirectHref();
                        // //2.助力后，将 链接userId改为 userId4Current 重定向
                    }
                } else if (loginThirdId4Current) {
                    //1.调用接口，帮 userId4Link 助力
                    redirectHref();
                    // //2.助力后，将 链接loginThirdId改为 loginThirdId4Current 重定向
                } else {
                    console.log('未登录1do nothing')
                    //第三方也没登录，什么也不做
                }
            } else if (loginThirdId4Link && loginThirdId4Link != '0') {
                if (userId4Current) {
                    //1.调用接口，帮 loginThirdId4Link 助力
                    // //2.助力后，将 链接userId改为 userId4Current 重定向
                    redirectHref();
                } else {
                    if (loginThirdId4Link.toString() == loginThirdId4Current.toString()) {
                        console.log('loginThirdId4Link 是本人do nothing')
                        //两个登录用户相同，什么也不做
                    } else {
                        //1.调用接口，帮 userId4Link 助力
                        redirectHref();
                    }
                }
            } else {
                if (userId4Current) {
                    // 链接userId改为 userId4Current 重定向
                    redirectHref()
                } else if (loginThirdId4Current) {
                    //链接loginThirdId改为 loginThirdId4Current 重定向
                    redirectHref()
                } else {
                    console.log('未登录2do nothing')
                    //没登录，什么也不做
                }
            }

            function redirectHref () {
                let tempUrlQuery = {
                    'userId': userId4Current || 0,
                    'loginThirdId': loginThirdId4Current || 0,
                };
                let querys = that.$router.history.current.query;
                let routerQuery = Object.assign({}, querys, tempUrlQuery);
                // let tempPath = that.$route.path.slice(0, -4) + that.random4Num();
                let tempPath = that.random4Num();
                for (let value in routerQuery) {
                    tempPath += that.hrefHasQuery(tempPath) + value + "=" + routerQuery[value];
                }
                window.location.href = tempPath.slice(1);
            }
        },
        /*帮好友助力*/
        helpFriend () {
            let that = this;
            // let userInfo = this.$store.getters.getterSharerInfo;
            let userInfo = window.sessionStorage.getItem('circleUserInfo') ? JSON.parse(window.sessionStorage.getItem('circleUserInfo')) : {};
            ;
            let userId4Link = userInfo.userId4Link || 0;
            let loginThirdId4Link = userInfo.loginThirdId4Link || 0;
            // console.log("this.currentUser :"+JSON.stringify(this.currentUser) )
            // console.log("this.currentThird :"+JSON.stringify(this.currentThird) )
            let userId4Current = this.currentUser && this.currentUser.userId ? this.currentUser.userId : 0;
            let loginThirdId4Current = this.currentThird && this.currentThird.id ? this.currentThird.id : 0;
            let tempUrlQuery = {
                'userId': userId4Current || 0,
                'loginThirdId': loginThirdId4Current || 0,
            };
            // if (!userId4Current && !loginThirdId4Current) {
            //     this.showWxAutoAlert()
            // }
            /*TODO 后台数据暂时没有定位的信息*/
            /*是否设置了定位信息，设置了定位信息，定位是否没有超出范围*/
            // if (that.actMsg.customerLimitKm && that.actMsg.customerLimitKm > 0) {
            //     if (that.$refs.geoLocation) {
            //         that.isNotOverstepDiscount = that.$refs.geoLocation.checkGeoLocation(that.actMsg.customerLimitKm);
            //     }
            //     if (that.isNotOverstepDiscount) {
            //         that.actTime = Object.assign({}, that.actTime, {notOverstepDiscount: true});
            //     } else {
            //         that.actTime = Object.assign({}, that.actTime, {notOverstepDiscount: false});
            //     }
            // } else {
            //     that.actTime = Object.assign({}, that.actTime, {notOverstepDiscount: true});
            // }
            if (userId4Link && userId4Link != '0') {
                if (userId4Current) {
                    if (userId4Link == userId4Current) {
                        console.log('userId4Link是本人do nothing')
                        //两个登录用户相同，什么也不做
                    } else {
                        //1.不相同，调用接口，帮 userId4Link 助力
                        this.doHelpFriend(userId4Link, userId4Current, loginThirdId4Link, loginThirdId4Current, tempUrlQuery);
                        // //2.助力后，将 链接userId改为 userId4Current 重定向
                    }
                } else if (loginThirdId4Current) {
                    //1.调用接口，帮 userId4Link 助力
                    this.doHelpFriend(userId4Link, userId4Current, loginThirdId4Link, loginThirdId4Current, tempUrlQuery);
                    // //2.助力后，将 链接loginThirdId改为 loginThirdId4Current 重定向
                } else {
                    console.log('未登录1do nothing')
                    //第三方也没登录，什么也不做
                }
            } else if (loginThirdId4Link && loginThirdId4Link != '0') {
                if (userId4Current) {
                    //1.调用接口，帮 loginThirdId4Link 助力
                    // //2.助力后，将 链接userId改为 userId4Current 重定向
                    this.doHelpFriend(userId4Link, userId4Current, loginThirdId4Link, loginThirdId4Current, tempUrlQuery);
                } else {
                    if (loginThirdId4Link == loginThirdId4Current) {
                        console.log('loginThirdId4Link 是本人do nothing')
                        //两个登录用户相同，什么也不做
                    } else {
                        //1.调用接口，帮 userId4Link 助力
                        this.doHelpFriend(userId4Link, userId4Current, loginThirdId4Link, loginThirdId4Current, tempUrlQuery);
                    }
                }
            }
        },
        doHelpFriend (userId4Link, userId4Current, loginThirdId4Link, loginThirdId4Current, tempUrlQuery) {
            let that = this;
            let location = XLocation.getUserLocation() || {};
            let params = {
                loginUserId: userId4Current,                     //----登录用户ID
                loginThirdId: loginThirdId4Current,              // ----登录第三方ID
                linkUserId: userId4Link,                     //----链接用户ID (即被助用用户ID)
                linkThirdLoginId: loginThirdId4Link,              // ----链接第三方ID
                longitude: location.longitude || 0,                  //----经度                      ++20200103++
                latitude: location.latitude || 0,                     //----纬度                      ++20200103++
            }
            /*判断是否限制了活动范围*/
            /*初始化商家设定的活动范围*/
            /*限制了活动范围需要，就需要定位完成之后才能帮助力*/
            /*TODO 接口没有活动的范围，这里先注释掉*/
            // if (that.actMsg.customerLimitKm && that.actMsg.customerLimitKm > 0) {
            //     if (that.isNotOverstepDiscount) {
            //         /*没有超过限制范围，帮助朋友，跳转自己的链接，购买按钮可以够买*/
            //         that.actTime = Object.assign({}, that.actTime, {notOverstepDiscount: true});
            //     } else {
            //         /*超过了限制范围，不帮助朋友,可跳转自己的链接，不能购买*/
            //         that.actTime = Object.assign({}, that.actTime, {notOverstepDiscount: false});
            //         //2.助力后，将 链接loginThirdId/链接userId改为 loginThirdId4Current/ userId4Current重定向
            //         // that.redirectHref(tempUrlQuery);
            //     }
            // } else {
            //     /*如果没有限制活动范围就可以直接助力*/
            //     that.actTime = Object.assign({}, that.actTime, {notOverstepDiscount: true});
            // }
            doHelp();

            function doHelp () {
                let url = `${that.NW_API_API_LOCALE_VERSION}/act/fission/${that.fission.actFissionId}/add/help`;
                that.xurl.post(url, params).then((data) => {
                    if (data.success) {
                        /*助力成功*/
                        console.log('助力成功')
                    } else if (data.errMsg) {
                        // that.$root.$emit('toast', {msg: data.errMsg})
                        console.log(data.errMsg)
                    } else {
                        that.$root.$emit('toast', { msg: "助力失败" })
                    }
                    let temtObj = {
                        'helpStatus': data.result || 0
                    }
                    window.sessionStorage.setItem('helpStatus', data.result || 0)
                    /*保存session,如果有就提示助力*/
                    //2.助力后，将 链接loginThirdId/链接userId改为 loginThirdId4Current/ userId4Current重定向
                    // tempUrlQuery = Object.assign({}, tempUrlQuery, temtObj)
                    // that.redirectHref(tempUrlQuery);
                });
            }
        },
        firstOpenAlertShow () {
            let openedPage = window.localStorage.getItem('openedPage') ? window.localStorage.getItem('openedPage') : false
            if (!openedPage) {
                this.getMoney.firstOpenAlert.show = true;
                window.localStorage.setItem('openedPage', JSON.stringify(true));
            } else {
                this.getMoney.firstOpenAlert.show = false;
            }
        },
        async storeMsgInit () {
            let that = this;
            this.storeId = this.$route.query && this.$route.query.storeId ? this.$route.query.storeId : null;
            this.menuType = this.$route.query && this.$route.query.menuType ? this.$route.query.menuType : 0
            this.menuId = this.$route.query && this.$route.query.menuId ? this.$route.query.menuId : 0;
            let tempObj = {};
            //菜单类型：1纯媒体 2活动 3商品 4买家秀 5大师
            /*获取页面导航栏, TODO 暂时注释*/
            // this.storeFissionApi({storeId:this.storeId,successFn:this.getFission});

            await this.getCustomerList(this.storeId)
            if (this.customerList && this.customerList.length > 0) {
                this.customerLength = this.customerList.length > 3 ? 3 : this.customerList.length
                setTimeout(() => {
                    this.$store.commit('setShowCustomerList', true)
                    setTimeout(() => {
                        this.$store.commit('setShowCustomerList', false)
                    }, 5000);
                }, 30000);
            }
            let promotionUrl = `${this.NW_API_API_LOCALE_VERSION}/promotion/user/${this.userId}/store/${this.storeId}/list`;
            let promotionParams = {
                pageNum: 1,
                pageSize: 10,
            }
            let arrRed = []
            await this.xurl.getLoading(promotionUrl, promotionParams).then((data) => {
                if (data.success) {
                    data.list.forEach(e => {
                        if (JSON.stringify(e.promotionFloats) != '[]') {
                            e.promotionFloats.forEach(redActivity => {
                                if (redActivity.packetInfo && redActivity.packetInfo.welPacketType == '4' && !redActivity.packetInfo.hadReceived) {
                                    let redEnvelopeData = {
                                        // userId: that.userId,
                                        // storeId: e.belongStoreInfo.storeId,
                                        welPacketId: redActivity.packetInfo.welPacketId,
                                        promotionId: e.promotionInfo.promotionId,
                                        terminalType: "6",
                                        joinScope: e.promotionChannel.joinScope,
                                        title: redActivity.packetInfo.title
                                    };
                                    arrRed.push(redEnvelopeData)
                                }
                            });
                        }
                    });
                }
            })
            if (JSON.stringify(arrRed) != '[]') {
                setTimeout(() => {
                    this.$store.commit("setredAlert", { show: true });
                }, 2500);
            }
            this.$store.commit('getredEnvelopeList', arrRed)
            let getTapUrl = `${this.NW_API_API_LOCALE_VERSION}/store/website/menu/list?storeId=${this.storeId}`
            /*处理直播中断的问题*/
            setInterval(() => {
                that.xurl.get(getTapUrl).then((data) => {
                    if (data && Array.isArray(data.list) && Array.isArray(that.menus) && that.menus.length > 0 && data.list.length > 0 && data.list.length > that.menus.length) {
                        that.menus = data.list;
                    }
                })
            }, 10000)
            // menus
            this.xurl.getLoading(getTapUrl).then((data) => {
                if (data.success) {
                    that.menus = data.list;
                    if ((!that.menuId && that.menuType !== 3) || !that.menuType) {
                        setMenuId(data);
                    } else if (that.menuType == 3) {
                        data.list.forEach((value, index) => {
                            if (data.list[index].menuType == 3) {
                                that.menuId = data.list[index].menuId;
                                that.menuType = data.list[index].menuType;
                            }
                        })
                    } else if (that.menuId || that.menuType) {
                        let menus = '';
                        let menuType = '';
                        if (that.menuId) {
                            menus = that.menus.every((menusVal) => {
                                return menusVal.menuId != that.menuId
                            })
                        }
                        if (that.menuType) {
                            menuType = that.menus.every((menusVal) => {
                                return menusVal.menuType != that.menuType
                            })
                        }
                        /*错误的链接的纠正方法，防止白屏*/
                        if (menus || menuType) {
                            setMenuId(data)
                        }
                    }
                    tempObj = {
                        storeId: that.storeId,
                        menuType: that.menuType,
                        menuId: that.menuId,
                        menus: that.menus,
                    };
                    this.updateStoreMenu(tempObj);
                    this.tapmenu(tempObj);
                    /*修改路由的时候注释*/
                    // that.showMenuItem(tempObj);
                }
            })
            let params = {
                thirdId: this.thirdId || 0,
                userId: this.userId || 0,
                storeId: this.storeId || 0,
                success: storeFn,
            }

            function storeFn (data) {
                let currentStore = that.currentStore || {};
                that.storeMsg = data || currentStore;
                that.praiseRate = data && data.praiseRate ? data.praiseRate : currentStore.praiseRate;
                // let tempLocation = XLocation.getLocationDiscount(data || currentStore);
                //
                // tempLocation.then((result) => {
                //     that.discountList = [];
                //     setTimeout(() => {
                //         that.discountList.push({
                //             storeId: that.storeId,
                //             discount: result,
                //         })
                //     }, 30)
                // });
                that.discountList = [];
                setTimeout(() => {
                    that.discountList.push({
                        storeId: that.storeId,
                        discount: that.currentUserStoreDiscount,
                    })
                }, 30)

            }

            //获取商家信息
            let currentStoreId = this.currentStore && this.currentStore.storeId ? this.currentStore.storeId : 0
            if (this.$route.query && this.storeId && this.storeId != currentStoreId) {
                this.merStoreGetStoreInfo(params);
            } else {
                storeFn();
            }

            function setMenuId (data) {
                let hasDefaultShow = false;
                for (let index = 0; index < data.list.length; index++) {
                    if (data.list[index].defaultShow) {
                        that.menuId = data.list[index].menuId;
                        that.menuType = data.list[index].menuType;
                        hasDefaultShow = true;
                        /*暂时是这样做的 登录过了而且是直播就可以默认进入，否则不能默认进入*/
                        if ((data.list[index].menuType == 6 && that.userId) || data.list[index].menuType != 6) {
                            break;
                        }
                    }
                }
                if (!hasDefaultShow) {
                    that.menuId = data.list[0].menuId;
                    that.menuType = data.list[0].menuType;
                }
            }
        },
        toPath (menus) {
            //菜单类型：1纯媒体 2活动 3商品 4买家秀 5大师 6直播
            let menusType = menus.menuType;
            let path = '';
            let routePath = this.$route.path;
            switch (menusType) {
                case 1:
                    path = '/store/panorama/' + this.random4Num();
                    // if(routePath.includes('/store/panorama/')){
                    //     path = routePath;
                    // }
                    break;
                case 2:
                    path = '/store/promotion/' + this.random4Num();
                    break;
                case 3:
                    path = '/store/goods/' + this.random4Num();
                    break;
                case 4:
                    path = '/store/buyShow/' + this.random4Num();
                    break;
                case 5:
                    path = '/store/master/' + this.random4Num();
                    break;
                case 6:
                    path = '/store/playDirect/' + this.random4Num();
                    break;
                default:
                    break;
            }
            return path
        },
        showMenuItem (obj) {
            if (obj && obj.isClick && this.menuType && obj.menuType == this.menuType) {
                return;
            }
            let that = this;
            let scrollPosition = 0;
            that.menus.forEach((value, index) => {
                if (value.menuId == obj.menuId) {
                    that.menus[index].defaultShow = true;
                    that.tMenuType = Number(obj.menuType);
                    that.tMenuId = Number(obj.menuId);
                    setTimeout(() => {
                        if (that.$refs.menuItem && that.$refs.menuItem[index]) {
                            scrollPosition = that.$refs.menuItem[index].offsetLeft;
                            that.$refs.headerBanner.scrollLeft = scrollPosition - document.documentElement.clientWidth / 375 * 80;
                        }
                    }, 100)
                } else {
                    that.menus[index].defaultShow = false;
                }
                that.menus[index] = Object.assign({}, that.menus[index]);
            });
            that.menus.splice(0, 1, that.menus[0]);
            that.commentType = obj.menuType;
        },
        tapmenu (obj, isClick) {
            /*路由相同的情况*/
            let that = this;
            let scrollPosition = 0;
            that.menus.forEach((value, index) => {
                if (value.menuId == obj.menuId) {
                    that.menus[index].defaultShow = true;
                    setTimeout(() => {
                        if (that.$refs.menuItem && that.$refs.menuItem[index]) {
                            scrollPosition = that.$refs.menuItem[index].offsetLeft;
                            that.$refs.headerBanner.scrollLeft = scrollPosition - document.documentElement.clientWidth / 375 * 80;
                        }
                    }, 100)
                } else {
                    that.menus[index].defaultShow = false;
                }
                that.menus[index] = Object.assign({}, that.menus[index]);
            });
            that.menus.splice(0, 1, that.menus[0]);
            that.commentType = obj.menuType;
            let needCloseChild = false;
            let historyRouter = this.$router.history.current.query
            let routeQuery = {}
            if (isClick) {
                routeQuery = {
                    storeId: this.storeId,
                    menuType: obj.menuType,
                    menuId: obj.menuId,
                    ttn: this.ttn,
                    shareId: 0
                }
            } else {
                routeQuery = {
                    storeId: this.storeId,
                    menuType: obj.menuType,
                    menuId: obj.menuId,
                    ttn: this.ttn,
                }
            }
            routeQuery = Object.assign(historyRouter, routeQuery);
            // if (routeQuery && Object.keys(routeQuery).includes('shareId') && this.$route.path.indexOf('/store/goods') == -1) {
            //     delete routeQuery.shareId
            // }
            if (obj.menuType == this.menuType && obj.menuId != this.menuId && isClick) {
                if (obj) {
                    this.showChild = false;
                }
                let tempObj = {
                    storeId: this.storeId,
                    menuType: obj.menuType,
                    menuId: obj.menuId,
                    menus: this.menus,
                };
                this.updateStoreMenu(tempObj);
                setTimeout(() => {
                    this.showChild = true;
                    this.menuType = obj.menuType;
                    this.menuId = obj.menuId;
                    this.$router.push({ path: this.toPath(obj), query: routeQuery });
                }, 20)
            } else {
                this.showChild = true;
                this.menuType = obj.menuType;
                this.menuId = obj.menuId;
                this.$router.push({ path: this.toPath(obj), query: routeQuery });
            }

        },
        doAttention (concernType, concernKey, key, cb, isCancelAttention) {
            if (!this.userId) {
                this.$router.push('/to/login');
                return;
            }
            let that = this;
            let params = {
                like: 'do',
                concernType,
                concernKey
            }
            let isDoConcerned = true;
            let attentionText = '关注成功';
            if (isCancelAttention) {
                params.like = 'cancel'
                isDoConcerned = false;
                attentionText = '取消关注成功'
            }
            this.$store.dispatch('doAttentionApi', params).then((data) => {
                if (data.success) {
                    /*不显示关注是否成功的文案*/
                    // this.$root.$emit('toast', {msg: attentionText});
                    that.storeMsg.concerned = isDoConcerned;
                    if (cb) {
                        cb();
                    }
                } else if (data.errMsg) {
                    this.$root.$emit('toast', { msg: data.errMsg })
                } else {
                    this.$root.$emit('toast', { msg: '关注失败' })
                }
            })
        },
        // wxShareCb(){
        //     if(this.$refs && this.$refs.storeItem){
        //         this.$refs.storeItem.wxShareCb();
        //     }
        // },
        getHeaderItem (msg, index) {
            let that = this;
            let tempObj = {
                nowSwiperIndex: 0,
                belongSwiperIndex: 0,
                headerType: 'moudule1',
                swiperLength: 1,
                rightType: 'storeHome',
                isNeedCancleAtt: true,
            }
            // belongUserInfo: {
            //     userId: 0,
            //     photo: '',
            //     userName: '',
            // },
            // mediaType:0,//表示视频，1表示轮播图
            // mediaContents:[
            //     {url:''}
            // ],
            // nowSwiperIndex:1,
            //belongSwiperIndex:0,
            //swiperLength:0,
            let storeHeaderMsg = {
                belongStoreInfo: {
                    storeId: this.storeId,
                    logo: this.storeMsg.logo,
                    // promotionId: ,
                    concerned: this.storeMsg.concerned,
                    name: this.storeMsg.name,
                    userId: 1,
                    evaluateLevel: "0",
                    industry: this.storeMsg.industry,
                    wxQrcode: this.storeMsg.wxQrcode
                },
            }
            return Object.assign({}, storeHeaderMsg, tempObj)
        },
    },
    watch: {
        '$route' (to, from) {
            // this.$router.go(0);
            this.showChild = false;
            setTimeout(() => {
                this.showChild = true;
            }, 20)
        },
        concerned (newval, oldval) {
            if (newval) {
                this.storeMsg.concerned = newval
            }
        },
        currentStore (val) {
            if (val && val.name) {
                setTimeout(() => {
                    document.title = this.currentStore && this.currentStore.name ? this.currentStore.name : '官方网站';
                }, 1000)
            }
        }
    },
    components: {
        "v-share": () => import("../../components/commonComponents/share/Share"),
        "v-header": () => import("../../components/commonActModel/header/Header"),
        'wx-share-body': () => import('../../components/wx/WxShareBody'),
        'wx-no-data-share-body': () => import('../../components/wx/WxNoDataShareBody'),
        // "new-red-alert": () => import("../../../pages/amusing/components/NewRedAlert"),
        "new-red-alert": () => import("../../pages/amusing/components/NewRedAlert"),
        'wx-hide-menu': () => import('../../components/wx/WxHideMenu'),
        'store-fission': () => import('./components/fission/FessionFloat'),
        'get-money': () => import('./components/fission/GetMoney'),
        "static-img-alert": () => import('../../components/commonComponents/alert/staticImgAlert'),
    },
}
</script>

<style scoped lang="scss">
.store-header-wbanner {
    min-height: 0.62rem;
}

.store-header-banner /deep/ {
    .fc-header {
        padding: 0.15rem 0;
        position: relative;
    }
}

.store-header {
    // background-image: -webkit-linear-gradient(rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%);
    // background-image: linear-gradient(rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%);
    background: #1f2533;
    height: 6.67rem;
    height: 100vh;
}

.content-wrap /deep/ {
    .goods-msg {
        background-image: -webkit-linear-gradient(
            rgba(0, 0, 0, 0) 0%,
            rgba(0, 0, 0, 0.3) 100%
        );
        background-image: linear-gradient(
            rgba(0, 0, 0, 0) 0%,
            rgba(0, 0, 0, 0.3) 100%
        );
    }
}

.store-header /deep/ {
    .look-index-mood {
        padding: 0;
        position: relative;
    }

    .no-wcomment {
        background-color: #202531;
    }

    .no-comment-text {
        color: #939599;
    }

    .no-data-wrap {
        background-color: #202531;
        position: relative;
        height: 100vh;
        z-index: 1;
    }
}

.store-header-wrap {
    width: 3.75rem;
    padding: 0 0.15rem;
    position: fixed;
    z-index: 1039;
    height: 1rem;
    background-image: linear-gradient(
        rgba(0, 0, 0, 0.5) 0%,
        rgba(0, 0, 0, 0) 100%
    );
}

.store-header-list {
    height: 0.3rem;
    white-space: nowrap;
}

.store-header-wlist {
    overflow: auto;
    height: 0.6rem;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-bottom: 0.3rem;
}

.hidden-scroll {
    height: 0.3rem;
    overflow: hidden;
    padding: 0;
    pointer-events: auto !important;
}

.under-line {
    height: 2px;
    width: 0.1rem;
    background-color: #fff;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: -0.05rem;
    /*-webkit-transition: left .3s;*/
    /*-moz-transition: left .3s ;*/
    /*-ms-transition: left .3s ;*/
    /*-o-transition: left .3s ;*/
    /*transition: left .3s ;*/
}

.store-item {
    text-shadow: 0 0 0.01rem #ccc;
    font-size: 0.16rem;
    text-align: left;
    padding: 0 0.2rem;
    display: inline-block;
    font-weight: bold;
    color: rgb(255, 255, 255);
    opacity: 0.6;
}

.store-header-list .store-item:first-of-type {
    padding-left: 0;

    .risk-active-line {
        left: calc(50% - 0.1rem);
    }
}

// .store-header-list .store-item:last-of-type {
//     padding-right: 0;
//     .risk-active-line{
//         left:calc(50% + .1rem);
//     }
// }

.store-item.active {
    // color: rgba(255, 255, 255, 1);
    opacity: 1;
}

.icon-arrows_right {
    text-shadow: 0 0 0.01rem #ccc;
    font-size: 0.2rem;
    color: rgba(255, 255, 255, 1);
}

.store-logo {
    width: 0.24rem;
    height: 0.24rem;
    object-fit: cover;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.store-location {
    color: #fff;
    font-size: 0.1rem;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap;
    bottom: -0.2rem;
}

.small-circle {
    display: inline-block;
    width: 2px;
    height: 2px;

    img {
        width: 100%;
        position: absolute;
    }
}

.store-logo-bottom {
    width: 100%;
    color: #000;
    background-color: #fff;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.25rem;
    padding: 0.01rem 0.02rem;
}

.store-msg {
    width: 0.24rem;
    position: relative;
}
// 子路由渐隐渐现
// 进入过渡开始
.fade-enter {
    opacity: 0;
}
// 进入过渡结束
.fade-enter-active {
    transition: opacity 0.3s;
}
// 离开过渡开始
.fade-leave-to {
    opacity: 0;
}
// 离开过渡结束
.fade-leave-active {
    transition: opacity 0.3s;
}
// 客服列表
.customer-icon {
    width: 0.28rem;
    height: 0.28rem;
    // background: #5d89e8;
    border-radius: 50%;
    // text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;

    img {
        width: 80%;
        height: 80%;
    }
}

.customer-bigbox {
    position: fixed;
    z-index: 200;
    max-width: 3.43rem;
    // width: 3.43rem;
    // height: 1.44rem;
    background: #fff;
    border-radius: 0.08rem;
    background: #fff;
    bottom: 10px;
    left: 50%;
    display: flex;
    align-items: center;
    transform: translateX(-50%);
}

.close {
    width: 0.25rem;
    height: 0.25rem;
    // background: #fff;
    position: absolute;
    top: -0.06rem;
    left: -0.06rem;

    img {
        width: 80%;
        height: 80%;
    }
}

.customer-box {
    width: 3.43rem;
    display: flex;
    align-items: center;
    overflow-x: auto;
    -ms-overflow-style: none; /* IE 10+ */
    scrollbar-width: none; /* Firefox */
    .customer-list {
        display: flex;
        justify-content: space-around;
        align-items: center;
        padding: 0.12rem;
    }

    .customer {
        box-sizing: border-box;
        position: relative;
        border-radius: 0.08rem;
        margin-right: 0.12rem;
        overflow: hidden;
        width: 0.92rem;
        height: 1.2rem;

        &:nth-last-child(1) {
            margin-right: 0;
        }

        .text {
            position: absolute;
            bottom: 0.08rem;
            left: 0.04rem;
            font-size: 0.12rem;
            color: #fff;
        }

        img {
            width: 100%;
            height: 100%;
        }
    }
}

.comment-enter-active,
.comment-leave-active {
    transition: all 0.5s linear;
    transform: translateX(-50%);
}

.comment-enter,
.comment-leave-active {
    transform: translateX(100%);
}

.first-enter /deep/ {
    .qr-code .module-bord-content {
        width: 3.2rem;
        padding: 0;
        background: transparent;
    }

    .code-wrap {
        position: relative;
    }

    .static-code {
        height: auto;
    }

    .btn-img {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 15%;
        width: 30%;
        margin: auto;
    }
}

// 导航栏下划线

.risk-active-line {
    width: 0.2rem;
    height: 0.02rem;
    border-radius: 1px;
    background: #fff;
    position: absolute;
    bottom: 0.02rem;
    left: 50%;
    transform: translateX(-50%);
}

.line-enter {
    opacity: 0;
}

.line-enter-active {
    transition: opacity 0.5s;
}

.line-leave-to {
    opacity: 0;
}

.line-leave-active {
    transition: opacity 0.5s;
}

// 直播导航栏icon样式
.direct {
    display: flex;
    justify-content: center;
    align-items: center;

    img {
        height: 0.22rem;
    }
}

.store-header-list {
    display: flex;
}
</style>